<!doctype html>
<html xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>详细地址管理</title>
<link rel="stylesheet" type="text/css" href="../zui/css/zui.min.css">
</head>

<body>
	<div id="app">
		<div class="alert alert-primary">
			<div class="content">Tips：开放文档地址 可以不需要登录即可访问，重写域名地址 填写后需开启：文档展示配置->强制重写域名 后才生效</div>
		</div>
		<table class="table table-bordered setting-table">
			<thead>
				<tr>
					<td style="width: 50px;">序号</td>
					<td>名称</td>
					<td>地址</td>
					<td>开放文档地址</td>
					<td>重写域名地址</td>
					<td>状态</td>
					<td>操作</td>
				</tr>
			</thead>
			<tbody>
				<tr v-for="(item,index) in swaggerLocationList" :key="item.id" :data-id="item.id" :data-index="index" >
					<td>{{index+1}}</td>
					<td>{{item.customName}}</td>
					<td>{{item.location}}</td>
					<td>
						<!--未开放时即使访问这个地址也看不了-->
						<a v-if="item.openVisit == 1" :href="'../../open-doc.html?doc='+item.uuid" target="_blank">{{item.uuid}}</a>
						<span v-else>暂未开放</span>
					</td>
					<td>{{item.rewriteDomainUrl}}</td>
					<td>
						<span class="label" v-if="item.disabled==1">已禁用</span>
						<span class="label label-success" v-else>启用中</span>
					</td>
					<td>
						<button class="btn btn-primary" type="button" @click="disableDocUrl(item.location, 0)" v-if="item.disabled==1">启用</button>
						<button class="btn btn-primary" type="button" @click="disableDocUrl(item.location, 1)" v-else>禁用</button>
						<button class="btn btn-danger" type="button" @click="deleteDocUrl(item.location)">删除</button>
						<button class="btn btn-info" type="button" v-on:click="editDocUrl($event)">编辑</button>
						<!--<button class="btn btn-danger" type="button" v-on:click="syncDocData($event)">持久化</button>-->
					</td>
				</tr>
				<tr>
					<td colspan="7" align="center">
						<button class="btn" type="button" v-on:click="btnRefreshList">　刷新　</button>
						<button class="btn btn-primary" type="button" v-on:click="addNewDocument">增加文档</button>
					</td>
				</tr>
			</tbody>
		</table>
		<!-- 增加文档弹出框 -->
		<div class="modal fade" id="addNewDocumentModal">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal">
							<span aria-hidden="true">×</span><span class="sr-only">关闭</span>
						</button>
						<h4 class="modal-title">输入文档地址</h4>
					</div>
					<div class="modal-body">
						<div class="input-line">
							文档名字：
							<input v-model="addNewCustomName" type="text" class="form-control" placeholder="可以自定义一个名字，将会在左上角下拉框里展示哦~">
						</div>
						<div class="input-line">
							文档地址：
							<input v-model="addNewDocumentInput" type="text" class="form-control" :readonly="addNewDocumentInput.indexOf('proxy-api-docs') > 0" placeholder="例：http://127.0.0.1/swagger-resources 或 http://127.0.0.1/v2/api-docs">
						</div>
						<div class="input-line">
							swagger文档内容：
							<textarea v-model="addNewSwaggerJson" type="text" rows="5" class="form-control" placeholder="swagger的json文档内容，和文档地址选填其一，如果填了则不再请求上面的地址获取内容，而是直接返回这里输入的"></textarea>
						</div>
						<div class="input-line">
							重写域名地址：
							<input v-model="rewriteDomainUrl" type="text" name="rewriteDomainUrl" class="form-control" placeholder="文档展示配置页 勾选“重写域名”重写的地址">
						</div>
						<div class="input-line">
							<div class="switch switch-inline">
								<input type="checkbox" v-model="openVisit">
								<label>是否开启开放文档</label>
							</div>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary" v-on:click="addNewDocumentBtn">保存</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
<script src="../mg-ui/js/jquery-3.1.0.min.js"></script>
<script src="../zui/js/zui.min.js"></script>
<script src="../mg-ui/js/common.js"></script>
<script src="../mg-ui/js/mg-ui-cache-keys.js"></script>
<script src="../vue/vue.js"></script>
<script src="../mg-ui/js/toast.js"></script>

<script>
	var urlBase = "../../";
	var app = new Vue({
		el: '#app',
		data: {
			swaggerLocationList: [],
			addNewDocumentInput: '',
			addNewSwaggerJson: '',
			rewriteDomainUrl: '',
			openVisit: '',
			oldLocation: '',
			addNewCustomName: '',
		},
		watch: {
		},
		methods: {
			btnRefreshList: function(){
				this.refreshList();
				Toast.success("刷新成功！");
			},
			refreshList: function () {
				getStorage(cacheKeys.swaggerLocationList, function (data) {
					//console.log(data);
					var swaggerLocationList = data;
					for (var i = 0; i < swaggerLocationList.length; i++) {
						swaggerLocationList[i].location = decodeURI(swaggerLocationList[i].location);
					}
					app.swaggerLocationList = swaggerLocationList;
				});
			},
			editDocUrl: function (event) {
				var tr = $(event.currentTarget).parents("tr");
				var index = tr.data("index");
				var item = app.swaggerLocationList[index];
				app.oldLocation = item.location;
				app.addNewDocumentInput = item.location;
				app.rewriteDomainUrl = item.rewriteDomainUrl;
				app.addNewSwaggerJson = "";
				app.addNewCustomName = item.customName;
				app.openVisit = (item.openVisit == 1);
				if (item.location.indexOf('proxy-api-docs') > 0) {
					var docId = item.location.substring(item.location.indexOf("?id=") + 4);
					// 获取文档内容
					ajaxTemp(urlBase + "swagger-mg-ui/document/proxy-api-docs", "get", "text", {id: docId}, function (json) {
						app.addNewSwaggerJson = json;
						$('#addNewDocumentModal').modal({moveable: true});
					});
				} else {
					$('#addNewDocumentModal').modal({moveable: true});
				}
			},
			addNewDocument: function(){
				app.openVisit = false;
				app.oldLocation = '';
				app.addNewDocumentInput = '';
				app.addNewSwaggerJson = "";
				app.addNewCustomName = "";
				$('#addNewDocumentModal').modal({moveable:true});
			},
			addNewDocumentBtn: function(){
				var addNewDocumentInput = app.addNewDocumentInput;
				if(isEmpty(addNewDocumentInput) && isEmpty(app.addNewSwaggerJson)) {
					Toast.error("地址不可以为空");return;
				}
				var param = {
					openVisit: app.openVisit ? 1 : 0,
					resourcesUrl: addNewDocumentInput,
					swaggerJson: app.addNewSwaggerJson,
					rewriteDomainUrl: app.rewriteDomainUrl,
					oldUrl: app.oldLocation,
					customName: app.addNewCustomName,
				};
				ajaxTemp(urlBase + "swagger-mg-ui/document/addSwaggerResources", "post", "json", param, function(json){
					if(validateResult(json)) {
						//window.parent.document.location.reload();
						//app.swaggerLocationList.push(addNewDocumentInput);
						app.refreshList();
						$('#addNewDocumentModal').modal('hide');
						Toast.success("保存成功，刷新后生效！");
					}
				});
			},
			deleteDocUrl: function (location) {
				if (!confirm("确定要删除吗？")) {
					return;
				}
				ajaxTemp(urlBase + "swagger-mg-ui/document/deleteSwaggerDoc", "post", "json", {location: location}, function (json) {
					if (validateResult(json)) {
						app.refreshList();
					}
				});
			},
			disableDocUrl: function (location, disable) {
				ajaxTemp(urlBase + "swagger-mg-ui/document/disableSwaggerDoc", "post", "json", {location: location, disable: disable}, function (json) {
					if (validateResult(json)) {
						Toast.success((disable == 1) ? "禁用成功！" : "启用成功！");
						app.refreshList();
					}
				});
			},
			syncDocData: function (event) {
				var tr = $(event.currentTarget).parents("tr");
				var index = tr.data("index");
				var newDocUrl = app.swaggerLocationList[index].location;
				ajaxTemp(urlBase + "swagger-mg-ui/document/syncDocData", "post", "json", {resourcesUrl: newDocUrl}, function (json) {
					if (validateResult(json)) {
						app.refreshList();
						Toast.success("持久化成功！");
					}
				});
			},
			encodeUrlParam: function(resourcesUrl) {
				var indexOf = resourcesUrl.indexOf("?");
				if (indexOf < 0) {
					return resourcesUrl;
				}
				var baseUrl = resourcesUrl.substring(0, indexOf + 1);
				var paramArr = resourcesUrl.substring(indexOf + 1).split("&");
				for (var i = 0; i < paramArr.length; i++) {
					var param = paramArr[i];
					var split = param.split("=");
					if (i > 0) {
						baseUrl.append("&");
					}
					if (split.length === 2) {
						baseUrl += split[0] + "=" + encodeURI(split[1]);
					} else {
						baseUrl += param;
					}
				}
				return baseUrl.toString();
			}
		},
		mounted: function(){
			this.refreshList();
		}
	});
</script>

<style>
	#app{padding-top: 10px;}
	.input-line{margin-bottom: 15px;}
</style>
</html>



